<template>
    <footer class="allout">
        <router-link to="/films" custom v-slot="{navigate,isActive}">
          <div @click="navigate" :class="isActive?'lth':''" class="headdiv">
            <i class="iconfont icon-morentouxiang"></i><br/>主页
          </div>
        </router-link>

        <router-link to="/Cinemas" custom v-slot="{navigate,isActive}">
          <div @click="navigate" :class="isActive?'lth':''" class="headdiv">
            <i class="iconfont icon-shipinhaoguanli"></i><br/>影院
          </div>
        </router-link>

        <router-link to="/myself" custom v-slot="{navigate,isActive}">
          <div @click="navigate" :class="isActive?'lth':''" class='headdiv'>
            <i class="iconfont icon-zitiguanli"></i><br/>我的
          </div>
        </router-link>
    </footer>
</template>

<style scoped>
.lth{
  color: red;
}
.headdiv{
  float: left;
  width: 33%;
  height: 0.5rem;
  text-align: center;
}
.allout{
  position:fixed;
  bottom: 0;
  width: 100%;
  height: 0.49rem;
  background-color: white;
  z-index: 100;
}
</style>